// 创建时间：2025-06-30
import React, { useState } from 'react';
import { Form, Input, Button, Typography, message } from 'antd';
import { Link, useNavigate } from 'react-router-dom';
import authService from '../../services/authService';

const { Title } = Typography;

const LoginPage = () => {
  const [loading, setLoading] = useState(false);
  const navigate = useNavigate();

  const onFinish = async (values) => {
    setLoading(true);
    try {
    console.log('Login attempt:', values);
    await authService.login(values.email.trim(), values.password);
    message.success('登录成功');
    console.log('Login successful');
      navigate('/dashboard');
    } catch (err) {
      console.error('Login error:', err);
      message.error('登录失败，请检查账号或密码');
    } finally {
      setLoading(false);
    }
  };

  return (
    <div style={{ maxWidth: 400, margin: '80px auto', padding: 32, background: '#fff', borderRadius: 8, boxShadow: '0 2px 16px #eee' }}>
      <Title level={2} style={{ textAlign: 'center' }}>登录</Title>
      <Form layout="vertical" onFinish={onFinish} autoComplete="off">
        <Form.Item
          name="email"
          label="邮箱"
          rules={[
            { required: true, message: '请输入邮箱' },
            { type: 'email', message: '请输入有效的邮箱地址' }
          ]}
        >
          <Input autoComplete="email" />
        </Form.Item>
        <Form.Item
          name="password"
          label="密码"
          rules={[
            { required: true, message: '请输入密码' }
          ]}
        >
          <Input.Password autoComplete="current-password" />
        </Form.Item>
        <Form.Item>
          <Button type="primary" htmlType="submit" block loading={loading}>登录</Button>
        </Form.Item>
        <Form.Item style={{ marginBottom: 0 }}>
          没有账号？<Link to="/auth/register">注册</Link>
        </Form.Item>
      </Form>
    </div>
  );
};

export default LoginPage;
